Skip to main content

Testing Strategy

This document outlines the testing approach for the NAVIGO project, focusing on unit tests, integration tests, and API tests. All automated tests were conducted using Vitest, ensuring fast, isolated, and reliable validation of both frontend and backend functionality.

1. Unit Testing with Vitest​

NAVIGO uses Vitest for unit and component testing because of its compatibility with Vite, TypeScript, and React. Vitest offers lightning-fast test execution, in-browser debugging, snapshot testing, and seamless mocking — ideal for a modern Vite-based development environment.

Scope of Unit Tests​

  1. React Component Rendering

    • Ensure components render correctly with default props and initial states.
    • Validate conditional rendering for active vs. completed quests and unlocked badges.
    • Verify correct rendering of UI elements such as buttons, modals, forms, lists, and notifications.
    • Test user feedback on interactions (clicks, hover, disabled states).
    • Confirm proper response to context and prop updates.

  2. State Management Logic

    • Test state changes using useState, useReducer, and Context API.
    • Verify that state updates propagate correctly to child components.
    • Validate derived states such as total points, progress, and leaderboard rank.
    • Confirm that completing a quest updates both points and user inventory.

  3. Utility Functions

    • Test logic for point calculations in quests, badges, and treasure hunts.
    • Verify leaderboard sorting and ranking algorithms.
    • Ensure quest filtering works by status, location, and difficulty.
    • Validate badge unlocking logic at threshold points.
    • Include edge case tests for zero, negative, and maximum points, and empty datasets.

  4. Firebase Data Manipulation

    • Mock Firestore to test CRUD operations safely (fetching, creating, updating, deleting documents).
    • Test correct data retrieval for quests, user profiles, badges, and leaderboard info.
    • Verify that Firestore writes and updates occur without data corruption.
    • Handle simulated network and Firestore errors gracefully.

  5. Form Validation & Authentication

    • Test input validation for registration and login (email format, password strength, etc.).
    • Verify Firebase Authentication and Google Sign-In integration using mock credentials.
    • Ensure that error messages display correctly for invalid login attempts.

  6. Error Handling and Edge Cases

    • Validate function robustness against empty, null, or malformed data.
    • Ensure correct handling of min/max points and leaderboard tie scenarios.
    • Confirm the application does not crash when exceptions occur during async Firebase calls.

Running Unit Tests​

To execute all unit tests:

npm run test

To run in watch mode during development:

npm run test:watch

Vitest automatically provides coverage reports through:

npm run coverage

These reports were integrated into GitHub Actions for automated testing in the CI/CD pipeline.

2. Integration Testing with Vitest​

Integration testing in NAVIGO ensures that different components, hooks, and services interact as expected. While unit tests focus on isolated logic, integration tests verify end-to-end flows within the frontend and Firebase ecosystem.

Scope of Integration Tests​

2.1 Quest Completion Flow​

  • Confirm that completing a quest updates user points in Firestore correctly.
  • Verify that badges and collectibles are awarded accurately.
  • Ensure the leaderboard reflects updated scores in real-time.
  • Validate the transition of quest status from active → completed.
  • Test simultaneous quest completions and invalid quest IDs.

2.2 Collectibles & Badges​

  • Verify that collecting a badge updates both the user inventory and UI.
  • Test notification pop-ups and reward animations for proper triggering.
  • Ensure badges display correctly in the profile page.
  • Handle duplicate or missing badge data gracefully.

2.3 Navigation & Component Interaction​

  • Test navigation flows between main pages (Dashboard → Quests → Profile → Leaderboard).
  • Confirm that modals, dropdowns, and other dynamic components render and behave properly.
  • Validate that state updates in one component (e.g., quest progress) propagate globally.
  • Verify responsiveness and consistent behavior across multiple screen sizes.

2.4 Leaderboard Updates​

  • Check that real-time leaderboard updates occur after quests and achievements.
  • Validate sorting for both weekly and all-time leaderboards.
  • Test tie-breaking logic and simultaneous user updates to prevent data conflicts.

2.5 Location Verification Integration​

  • Mock Google Maps API calls to validate GPS coordinates.
  • Ensure that only verified locations trigger quest completion.
  • Verify that Firestore correctly stores location verification data.
  • Simulate API failures and out-of-bounds coordinates to ensure robust error handling.

Running Integration Tests​

To execute all integration tests, run:

npm run test:integration